
.bodyBgImg{
  position: fixed;
  z-index: 0;
  width: 100%;
  height: 528rpx !important;
  top: 0;
  left: 0;
}
.myPage{
  width: 100vw;
  height: 100%;
  overflow: hidden;
  margin-bottom: 30rpx; // padding-bottom: 20rpx;兼容凸起来的地方
  padding: 0 32rpx;
  
  .bgf{
    background-color: #FFF;
  }
  .flex1{
    flex: 1;
  }
  .redDot{
    width: 16rpx;
    height: 16rpx;
    border-radius: 16rpx;
    background: #E44435;
    position: absolute;
    right: 0;
    transform: translateX(8rpx);
    top: 0;
  }
  .pos1{
    position: relative;
    z-index: 1;
    box-shadow: 0rpx 4rpx 24rpx rgba(150, 151, 153, 0.16);
  }
  .topBgBox{
    height: 528rpx;
    box-sizing: border-box;
    .topBox{
      width: 100%;
      height: 100%;
      display: flex;
      flex-flow: column;
      justify-content: space-between;
      position: relative;
      z-index: 9;
      .tips{
        position: absolute;
        top: -84rpx;
        left: 40rpx;
        line-height: 72rpx;
        color: #FFFFFF;
        border-radius: 16rpx;
        background: #000000;
        opacity: 0.7;
        // background: rgba(0, 0, 0, 0.7);
        padding: 0 20rpx;
        .arrow_down {
          width: 0;
          height: 0;
          border-left: 12rpx solid transparent;
          border-right: 12rpx solid transparent;
          border-top: 12rpx solid #000000;
          position: absolute;
          left: 30rpx;
          bottom: -12rpx;
        }
      }
      .headBox{
        position: sticky;
        justify-content: space-between;
        flex: 1;
        .headImg{
          width: 96rpx;
          height: 96rpx;
          border-radius: 96rpx;
          overflow: hidden;
          flex: 0 0 auto;
        }
        .homepage_box {
          color: #fff;
          flex: 0 0 auto;
        }
        .communityName_box {
          @include bov(2);
        }
      }

      .topCard{
        width: 100%;
        border-radius: 16rpx;
        box-shadow: 0rpx 4rpx 24rpx rgba(150, 151, 153, 0.16);
        .grBox2{
          width: 48rpx;
          height: 48rpx;
          border-radius: 48rpx;
          margin: 0 auto;
          position: relative;
        }
      }
    }
  }

  .switch_module_box {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8rpx 16rpx;
    border: 2rpx solid #E44435;
    box-sizing: border-box;
    border-radius: 200rpx;
    color: #E44435;
    font-size: 20rpx;
    position: relative;
    .icon-qiehuan {
      margin-right: 8rpx;
    }
    .redDot {
      right: 8rpx;
      top: -4rpx;
    }
  }
  .profit_box {
    padding: 24rpx 32rpx;
    border-radius: 16rpx;
    color: #323233;
    margin-top: 24rpx;
    box-shadow: 0rpx 4rpx 24rpx rgba(150, 151, 153, 0.16);
    position: relative;
    .income_box {
      justify-content: space-between;
      .red_btn {
        padding: 12rpx 32rpx;
      }
    }
    .other_msg_box {
      .mun_box1 {
        min-width: 96rpx;
      }
      .mun_box2 {
        min-width: 120rpx;
      }
      .mun_box3 {
        min-width: 72rpx;
      }
    }
  }
  // 关注公众号
  .follow_box_z {
    width: 100%;
    height: 180rpx;
  }
  .follow_box {
    background: rgba(0, 0, 0, 0.6);
    height: 128rpx;
    width: calc(100vw - 32rpx);
    border-radius: 8rpx;
    position: fixed;
    bottom: calc(constant(safe-area-inset-bottom) + 132rpx);
    bottom: calc(env(safe-area-inset-bottom) + 132rpx);
    left: 16rpx;
    z-index: 99;
    padding: 0 16rpx;
    color: #fff;
    .red_btn {
      height: 64rpx;
      padding: 0 70rpx;
      font-size: 28rpx;
      border-radius: 64rpx;
      line-height: 64rpx;
      background-color: #E44435;
      color: #fff;
    }
  }
  .cellBox{
    flex: 1;
    height: 128rpx;
    border-radius: 16rpx;
    position: relative;
    padding: 24rpx;
    color: #FFF;
  }
  .cell1Box{
    background: linear-gradient(98.24deg, #FE7A1D -2.64%, #FE7A1D 100.26%);
    margin-right: 12rpx;
    .bgImg{
      position: absolute;
      right: 0;
      bottom: 0;
      width: 120rpx;
      height: auto;
      z-index: 1;
    }
    .bgImg2{
      position: absolute;
      right: -35rpx;
      bottom: 20rpx;
      width: 40rpx;
      height: auto;
      z-index: 2;
    }
  }
  .cell2Box{
    background: linear-gradient(98.53deg, #B353FF 0.26%, #B353FF 100%);
    margin-left: 12rpx;
    .bgImg{
      position: absolute;
      right: 0;
      bottom: 0;
      width: 112rpx;
      height: auto;
      z-index: 1;
    }
  }
  .grBox{
    width: 80rpx;
    height: 80rpx;
    border-radius: 80rpx;
    margin: 24rpx auto;
  }
  .myGr3{
    background: linear-gradient(135deg, #71A6F5 0.26%, #6FA8FE 100.26%);
  }
  .myGr2{
    background: linear-gradient(135deg, #F59551 -0.26%, #FF994F 99.74%);
  }
  .myGr1{
    background: linear-gradient(135deg, #7FA9FA 0%, #7EAAFE 100%);
  }
  .grBox2{
    width: 48rpx;
    height: 48rpx;
    border-radius: 48rpx;
    margin: 0 auto;
    margin-top: 32rpx;
    position: relative;
  }
  .grBox3 {
    width: 100%;
    position: relative;
    .icon_box {
      display: block;
      margin: 24rpx auto 0;
    }
  }
}
// 邀请好友
//.posterContent {
//  position: relative;
//  width: 100%;
//  height: 100%;
//  .popupHeader {
//    width: 100%;
//    height: 96rpx;
//    margin-bottom: 48rpx;
//    text-align: center;
//    line-height: 96rpx;
//    font-size: 32rpx;
//    font-weight: 500;
//    color: $n8Color;
//  }
//  .mySwiper {
//    width: auto;
//    height: 400rpx;
//    overflow: hidden
//  }
//  .imageWrap {
//    box-sizing: border-box;
//    width: 480rpx;
//    height: 400rpx;
//    border-radius: 16rpx;
//    background: #FFFFFF;
//    opacity: 0.5;
//    transition: all .5s linear;
//  }
//  .image_content {
//    width: 480rpx;
//    height: 384rpx;
//    border-radius: 16rpx;
//    transition: all .5s linear;
//  }
//  .groupImage {
//    box-sizing: border-box;
//    display: flex;
//    margin: 48rpx 72rpx 64rpx;
//  }
//  .imageView {
//    margin-right: 32rpx;
//    background: #FFFFFF;
//    opacity: 0.5;
//    transition: all .5s linear;
//  }
//  .imageItem {
//    display: block;
//    width: 160rpx;
//    height: 128rpx;
//    border-radius: 8rpx;
//  }
//  // 激活swpier
//  .activeSwiper {
//    // swiper
//    .imageWrap {
//      box-sizing: border-box;
//      opacity: 1;
//      transition: all .5s linear;
//    }
//    // swiper
//    .image_content {
//      background: #F2F3F5;
//      box-shadow: 0 4rpx 16rpx 0 rgba(141, 37, 37, 0.2);
//      transition: all .5s linear;
//    }
//    // groupImage
//    &.imageView {
//      box-sizing: border-box;
//      background: #F2F3F5;
//      opacity: 1;
//      transition: all .5s linear;
//    }
//    .imageItem {
//      border: 2rpx solid #FFFFFF;
//      transition: all .5s linear;
//    }
//  }
//  .footer_btn {
//    width: 100%;
//    padding: 0 32rpx 24rpx;
//    .btn {
//      display: flex;
//      justify-content: center;
//      padding: 22rpx;
//      font-size: 32rpx;
//      line-height: 44rpx;
//      border-radius: 64rpx;
//      color: #ffffff;
//      background-color: $themeColor;
//    }
//    .icon-weixin1 {
//      font-size: 40rpx;
//      margin-right: 16rpx;
//    }
//  }
//}
